import * as React from "react";

const { useState, useRef, useCallback } = React;

const useGetState = (initialState) => {
  const [state, setState] = useState(initialState);

  const stateRef = useRef(state);
  stateRef.current = state;

  const getState = useCallback(() => stateRef.current, []);

  return [state, setState, getState];
};

const App = () => {
  //! 通过render来判定是否批量渲染
  console.log("render");
  const [count, setCount] = useState(0);

  const handleAdd = () => {
    setTimeout(() => {
      debugger;
      setCount((count) => count + 1);
      debugger;
      setCount((count) => count + 1);
      debugger;
      setCount((count) => count + 1);
    }, 10);
  };
  return (
    <div>
      <h1>{count}</h1>
      <button onClick={handleAdd}>+1</button>
    </div>
  );
};

export default App;
